import React, { Component } from 'react'
import { Layout, Breadcrumb } from 'antd'
import MySider from './components/MySider'
import RouterView from '../../router'
import RouteList from '../../router/routerConfig'

const { Header, Sider, Content } = Layout

export default class Home extends Component {
    render() {
        let pathname = this.props.location.pathname.slice(1).split('/')
        return (
            <div className="h100">
                <Layout>
                    <Header>Header</Header>
                    <Layout>
                        <Sider>
                            <MySider />
                        </Sider>
                        <Content>
                            {/* 面包屑 */}
                            <Breadcrumb>
                                {
                                    pathname.map((item, index) => {
                                        return  <Breadcrumb.Item key = { index }>
                                            <a href="">{ item }</a>
                                        </Breadcrumb.Item>
                                    })
                                }
                            </Breadcrumb>
                            <div className="context">
                                <RouterView router={RouteList[0].children} />
                            </div>
                        </Content>
                    </Layout>
                </Layout>
            </div>
        )
    }
}
